<template lang="pug">
  div#Set
    div.top-header
      i.iconfont.icon-fanhui(@click="$router.push('/wode')")
      span.top-header-title 设置
    div.head-block
      span.info-title 头像
      div.head-img
        img(:src="userData.headImg")
    div.info-block
      div.info-list
        span.info-title 昵称
      div.info-list
        span.info-title 用户名
      div.info-list
        span.info-title 性别
      div.info-list
        span.info-title 地区
    div.save-btn 保存
</template>
<script>
  export default {
    data() {
      return {
        userData: {
          headImg: require('@/assets/wode/userHead.png')
        }
      }
    }
  }
</script>
<style scoped lang="less">
  #Set {
    .info-title {
      font-size: 12px;
      float: left;
    }
    .head-block {
      padding: 10px 20px;
      margin: 5px 0;
      background: #fff;
      overflow: hidden;
      .head-img {
        float: right;
        height: 60px;
        width: 60px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border-radius: 50%;
      }
      .info-title {
        line-height: 60px;
      }
    }
    .info-block {
      background: #fff;
      .info-list {
        height: 40px;
        border-bottom: 1px solid #f5f5f5;
        padding: 0 20px;
        line-height: 40px;
      }
    }
    .save-btn {
      height: 35px;
      background: #080c15;
      color: #fff;
      font-size: 12px;
      line-height: 35px;
      width: calc(100% - 40px);
      position: fixed;
      bottom:20px;
      left:20px;
    }
  }
</style>
